import React, { Component } from 'react';
import './TarBar.css'
import { mapState, mapDisPatch } from '../../store/bindState'
class TarBar extends Component {
  changeBarIndex(index) {
    //修改bar的状态
    this.props.changeBarIndex(index);
    //实现页面跳转
    this.props.history.replace(this.props.items[index].path);
    // this.props.changeTitle(this.props.items[index].title)
  }
  render() {
    return (
      <div>
        {this.props.isTabBarShow ? (<div className="tabBar" >
          {this.props.items.map((item, index) => {
            return <div key={index} className={this.props.selectBarIndex == index ? 'active' : null} onClick={this.changeBarIndex.bind(this, index)}>
              <i className={'iconfont ' + item.iconname}></i>
              <h3>{item.title}</h3>
            </div>
          })}

        </div>) : null}
      </div>
    );
  }
}

export default mapDisPatch(mapState(TarBar, ['selectBarIndex','isTabBarShow']), [{ type: "changeBarIndex", params: true }]);